<!DOCTYPE HTML>
<!--

  Author: eae@google.com (Emil A Eklund)
-->
<html>
<!--
Copyright 2009 The Closure Library Authors. All Rights Reserved.

Use of this source code is governed by an Apache 2.0 License.
See the COPYING file for details.
-->
<head>
  <title>Closure Unit Tests - goog.positioning.ViewportClientPosition</title>
  <script src="../base.js"></script>
  <script>
    goog.require('goog.dom');
    goog.require('goog.positioning.ViewportClientPosition');
    goog.require('goog.style');
    goog.require('goog.testing.jsunit');
    goog.require('goog.userAgent');
  </script>
</head>
<body>
  <!--
    Uses an iframe to avoid window size problems when running under Selenium.
  -->
  <iframe id="frame1" style="width: 200px; height: 200px;"
          src="anchoredviewportposition_test_iframe.html">
  </iframe>

  <script>
    var viewportSize, anchor, popup, dom, frameRect;
    var corner = goog.positioning.Corner;

    // Allow positions to be off by one in gecko as it reports scrolling
    // offsets in steps of 2.
    var ALLOWED_OFFSET = goog.userAgent.GECKO ? 1 : 0;


    function setUp() {
      var frame = document.getElementById('frame1');
      var doc = goog.dom.getFrameContentDocument(frame);

      dom = goog.dom.getDomHelper(doc);
      viewportSize = dom.getViewportSize();
      anchor = dom.getElement('anchor');
      popup = dom.getElement('popup');
      goog.style.setSize(popup, 20, 20);
      frameRect = goog.style.getVisibleRectForElement(doc.body);
    }


    function testPositionAtCoordinateTopLeft() {
      var pos = new goog.positioning.ViewportClientPosition(100, 100);
      pos.reposition(popup, corner.TOP_LEFT);

      var offset = goog.style.getPageOffset(popup);
      assertEquals('Left edge of popup should be at specified x coordinate.',
                   100,
                   offset.x);
      assertEquals('Top edge of popup should be at specified y coordinate.',
                   100,
                   offset.y);
    }


    function testPositionAtCoordinateBottomRight() {
      var pos = new goog.positioning.ViewportClientPosition(100, 100);
      pos.reposition(popup, corner.BOTTOM_RIGHT);

      var bounds = goog.style.getBounds(popup);
      assertEquals('Right edge of popup should be at specified x coordinate.',
                   100,
                   bounds.left + bounds.width);
      assertEquals('Bottom edge of popup should be at specified x coordinate.',
                   100,
                   bounds.top + bounds.height);
    }


    function testPositionAtCoordinateTopLeftWithScroll() {
      dom.getDocument().body.style.paddingTop = '300px';
      dom.getDocument().body.style.height = '3000px';
      dom.getDocumentScrollElement().scrollTop = 50;
      dom.getDocument().body.scrollTop = 50;

      var pos = new goog.positioning.ViewportClientPosition(0, 0);
      pos.reposition(popup, corner.TOP_LEFT);

      var offset = goog.style.getPageOffset(popup);
      assertEquals('Left edge of popup should be at specified x coordinate.',
                   0,
                   offset.x);
      assertTrue('Top edge of popup should be at specified y coordinate ' +
                 'adjusted for scroll.',
                 Math.abs(offset.y - 50) <= ALLOWED_OFFSET);

      dom.getDocument().body.style.paddingLeft = '1000px';
      dom.getDocumentScrollElement().scrollLeft = 500;

      pos.reposition(popup, corner.TOP_LEFT);
      offset = goog.style.getPageOffset(popup);
      assertTrue('Left edge of popup should be at specified x coordinate ' +
                 'adjusted for scroll.',
                 Math.abs(offset.x - 500) <= ALLOWED_OFFSET);

      dom.getDocumentScrollElement().scrollLeft = 0;
      dom.getDocumentScrollElement().scrollTop = 0;
      dom.getDocument().body.style.paddingLeft = '';
      dom.getDocument().body.style.paddingTop = '';

      pos.reposition(popup, corner.TOP_LEFT);
      offset = goog.style.getPageOffset(popup);
      assertEquals('Left edge of popup should be at specified x coordinate.',
                   0,
                   offset.x);
      assertEquals('Top edge of popup should be at specified y coordinate.',
                   0,
                   offset.y);
    }


    function testOverflowRightFlipHor() {
      var pos = new goog.positioning.ViewportClientPosition(frameRect.right,
                                                            100);
      pos.reposition(popup, corner.TOP_LEFT);

      var offset = goog.style.getPageOffset(popup);
      assertEquals('Left edge of popup should have been adjusted so that it ' +
                  'fits inside the viewport.',
                   frameRect.right - popup.offsetWidth,
                   offset.x);
      assertEquals('Top edge of popup should be at specified y coordinate.',
                   100,
                   offset.y);
    }


    function testOverflowTopFlipVer() {
      var pos = new goog.positioning.ViewportClientPosition(100, 0);
      pos.reposition(popup, corner.TOP_RIGHT);

      var offset = goog.style.getPageOffset(popup);
      assertEquals('Left edge of popup should be at specified x coordinate.',
                   80,
                   offset.x);
      assertEquals('Top edge of popup should have been adjusted so that it ' +
                  'fits inside the viewport.',
                   0,
                   offset.y);
    }


    function testOverflowBottomRightFlipBoth() {
      var pos = new goog.positioning.ViewportClientPosition(frameRect.right,
                                                            frameRect.bottom);
      pos.reposition(popup, corner.TOP_LEFT);

      var offset = goog.style.getPageOffset(popup);
      assertEquals('Left edge of popup should have been adjusted so that it ' +
                  'fits inside the viewport.',
                   frameRect.right - popup.offsetWidth,
                   offset.x);
      assertEquals('Top edge of popup should have been adjusted so that it ' +
                  'fits inside the viewport.',
                   frameRect.bottom - popup.offsetHeight,
                   offset.y);
    }
  </script>
</body>
</html>
